<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
	<title>Promise testDemo</title>
	<style type="text/css">
	* {
		padding: 0;
		margin: 0;
	}
	 
</style>
</head>
<body>
	<h1>aaaa</h1>
	<div id="box">
	    <h2>第九章 闭包与作用域</h2>
	    <button>收藏课程</button>
	  </div>
</body>
<script src="index.js"></script>
<script type="text/javascript">
function axios (url) {
  return new Promise((resolve, reject) => {
    let xhr = new XMLHttpRequest()
    xhr.open('GET', url)
    xhr.send()
    xhr.onload = function() {
      if (this.status === 200) {
        // resolve(this.response)
        resolve(JSON.parse(this.response))
      } else {
        reject(this)
      }
    }
  })
} 
function queue (promises) {
  promises.reduce((promise, next) => promise.then(next), Promise.resolve())
}

let url = `http://localhost/ajax/ajax3.php?&t=1`;

/*
queue(
  [1, 2, 3].map(v => () =>
    axios(`${url}&id=${v}`).then(user => console.log(user))
  )
)
*/
var arr = [1, 2, 3], i = 0;

axios(`${url}&id=${arr[i]}`).then(response => {
    ++i
    console.log(response)
    if(i === arr.length) {
      return new Promise(() => {});
    } else {
      return axios(`${url}&id=${arr[i]}`)
    }
}).then(response => {
  ++i
    console.log(response)
    if(i === arr.length) {
      return new Promise(() => {});
    } else {
      return axios(`${url}&id=${arr[i]}`)
    }
}).then(response => {
  ++i
    console.log(response)
    if(i === arr.length) {
      return new Promise(() => {});
    } else {
      return axios(`${url}&id=${arr[i]}`)
    }
}).then(response => {
  ++i
    console.log(response)
    if(i === arr.length) {
      return new Promise(() => {});
    } else {
      return axios(`${url}&id=${arr[i]}`)
    }
})
</script>
</html>